import React, { Component } from 'react';
import Comsmall from './ComSmall';

class Combig extends Component {
  constructor() {
    super();
    this.state = {
      msg: '好好学习天天向上',
      // 子传父的数据
      info: ''
    }
  }
  setMsg() {
    // 单向数据流，父组件的变化会影响子组件，反过来就不行
    this.setState({
      msg: '777'
    })
  }
  // 子传父：需要先父传子一个函数，在子组件中调用函数，同时传入参数，这个参数就是子传父的数据
  post(val) {
    this.setState({
      info: val
    })
  }
  render() {
    return (
      <div>
        <p>父组件</p>
        <Comsmall
          msg1={this.state.msg}
          msg2="good"
          msg3={(val)=>this.post(val)}
        ></Comsmall>
        <button onClick={()=>this.setMsg()}>修改自己的数据</button>
        <mark>1111{this.state.info}</mark>
      </div>
    );
  }
}

export default Combig;
